<template>
	<view class="page-content">

		<swiper class="swiper" display-multiple-items="4" :autoplay="false">
			<swiper-item v-for="(item, index) in typeList" class="itemType " :class="[item.value == type && 'on']"
				@tap="tabSelect(item.value)">
				<view>{{ item.label }}</view>
			</swiper-item>
		</swiper>

		<scroll-view v-if="list.length > 0" style="white-space: normal;" class="order-list-wrap" scroll-y>
			<div class="swiperContent pb-100">

				<view class="job-card" v-for="(job, index) in list" :key="index" @click="goJobDetail(job)">
					<view class="card-top">
						<text class="job-title">{{ job.professionName }}</text>
						<text class="job-salary">{{ job.salary }}{{ job.salaryMonth ? '·' + job.salaryMonth + '薪' : ''
						}}</text>
					</view>
					<view class="card-company">
						<text>{{ job.companyName }} {{ job.companySizeName }}</text>
						<text class="card-company-location">{{ job.areaName }}</text>
					</view>
					<view class="card-tags">
						<text class="tag" v-for="tag in job.postKey.split(',')" :key="tag">{{ tag }}</text>
					</view>
					<view class="card-bottom">
						<view class="hr-info">
							<text class="hr-name">{{ job.creator }}·{{ job.creatorPostName }}</text>
						</view>
						<view class="online-status">
							<view class="dot"></view>
							<text>当前在线</text>
						</view>
					</view>
				</view>

			</div>

		</scroll-view>
		<without v-if="list.length < 1 && listLoad"></without>
	</view>
</template>

<script>
let app = getApp();
import { positionQuery } from '@/api/index.js'
import { parseTime } from '../../utils/index.js'
export default {
	components: {


	},
	data() {

		return {
			typeList: [{
				value: 1,
				label: '沟通过'
			}, {
				value: 2,
				label: '看过我'
			}, {
				value: 3,
				label: '已投简历'
			}, {
				value: 4,
				label: '职位收藏'
			}
			],
			type: 1,
			list: [],
			listLoad: false,
			searchForm: {
				status: '',
				limit: 10,
				page: 1
			},
			listData: {
				records: []
			},
			allLoad: false
		};
	},
	onPullDownRefresh() {
		uni.stopPullDownRefresh();
		this.getList()
	},

	async onLoad(opt) {
		if (opt.status) {
			this.type = opt.status;
			await this.getList()
		}

		// this.getData();
	},
	methods: {
		async tabSelect(value, index) {
			this.type = value
			await this.getList()
		},
		async getList() {
			this.listLoad = false
			this.list = []
			const { rows } = await positionQuery({
				type: this.type
			})
			this.list = rows
			this.listLoad = true

		},
		// 跳转职位详情
		goJobDetail(item) {
			console.log(item)
			uni.navigateTo({
				url: `/pages/position/detail?positionId=${item.positionId}`
			})
		},
	}
}
</script>

<style lang="scss">
.swiper {
	width: 100%;
	z-index: 1000;
	background: #FFFFFF;
	height: 90upx;
	line-height: 90upx;
	text-align: center;
	font-size: 28upx;
	color: #666666;
}

.swiper .on {
	color: #37AF71;
}

.itemType {
	position: relative;
}

.itemType.on:after {
	position: absolute;
	bottom: 8upx;
	left: 50%;
	transform: translateX(-50%);
	content: '';
	display: block;
	width: 36upx;
	height: 6upx;
	background: #37AF71;

}

.swiperContent {
	margin: 20upx;
}

.page-content {
	position: absolute;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.order-list-wrap {
	flex: 1;
	overflow: hidden;
	display: flex;
}

.dis-b {
	display: block;
}
</style>
